<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- Meta, title, CSS, favicons, etc. -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

<link th:replace="fragments/dependency :: list-css">

<title>优铺Admin</title>
</head>

<body class="nav-md">
	<div class="container body">
		<div class="main_container">
			<!-- Left Menu -->
			<div th:replace="fragments/leftMenu :: leftMenu"></div>

			<!-- top navigation -->
			<div th:replace="fragments/header :: header"></div>


			<!-- page content -->
			<div class="right_col" role="main">
				

				<div class="ln_solid"></div>
				<div class="col-md-12 col-sm-12 col-xs-12">
                <div class="x_panel">
                  <div class="x_title">
                  	<h2>文章信息</h2>
                    <ul class="nav navbar-right panel_toolbox">
                      <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                      </li>
                    </ul>
                    <div class="clearfix"></div>
                  </div>
                   <!-- 按钮区域 -->
                  
                  <!-- 搜索区域 -->
                  <div class="x_content">
                  	<div class="form-inline">
                  		<div class="form-group">
							<label for="ex4"> 一级分类：</label> 
							<select class="form-control" name="oneCatId" id="oneCatId">
								<option value="">请选择</option>
								<option th:each="item:${oneCategory}" th:value="${item.id}" th:text="${item.name}" th:selected="${param.oneCatId == item.id}"></option>
							</select>
						</div>
						<div class="form-group">
							<label for="ex4"> 二级分类：</label> 
							<select class="form-control" name="catId" id="catId">
								<option value="">请选择</option>
							</select>
						</div>
		                  <div class="form-group">
		                    <label for="ex3">文章标题：</label>
		                    <input type="text" id="ex3" name="title" th:value="${param.title}" class="form-control" placeholder=" ">
		                  </div>
		                  <div class="x_title">
								<div class="clearfix"></div>
							</div>
		                  
		                  <div class="form-inline">
								<div class="form-group">
									<label for="ex4"> 开始时间：</label>
									<div class='input-group date' id='myDatepicker0'>
										<input type='text' class="form-control" name="beginTime" th:value="${#strings.isEmpty(param.beginTime)}?'': ${param.beginTime[0]}" /> <span class="input-group-addon"> <span class="glyphicon glyphicon-calendar"></span>
										</span>
									</div>
								</div>

								<div class="form-group">
									<label for="ex4"> 结束时间：</label>
									<div class='input-group date' id='myDatepicker1'>
										<input type='text' class="form-control" name="endTime" th:value="${#strings.isEmpty(param.endTime)}?'': ${param.endTime[0]}" /> <span class="input-group-addon"> <span class="glyphicon glyphicon-calendar"></span>
										</span>
									</div>
								</div>
							</div>
                		</div>
                  </div>
                  <div class="x_title">
                    <div class="clearfix"></div>
                  </div>
                  
                  <div class="x_content">
                    <button type="button" class="btn btn-round btn-primary hide" name="add" permission-rel="/article/addPage">新增</button>
                    <button type="button" class="btn btn-round btn-success hide" name="query" permission-rel="/article/addPage">查询</button>
                  </div>
                  <div class="x_title">
                    <div class="clearfix"></div>
                  </div>
                  <div class="text-right">
					<span class="label label-info" th:text="'总数：'+${pageList.totalElements}"></span>
				  </div>
                  <div class="x_content">
                    <div class="table-responsive">
                      <table class="table table-striped jambo_table bulk_action">
                        <thead>
                          <tr class="headings">
                          <th class="column-title">编号 </th>
                            <th class="column-title">文章标题 </th>
                            <th class="column-title">所属分类 </th>
                            <th class="column-title">作者/来源 </th>
                            <th class="column-title">添加时间 </th>
                            <th class="column-title">状态 </th>
                            <th class="column-title">数据 </th>
                            <th class="column-title" th:if="${param.catId}">排序 </th>
                            <th class="column-title">状态管理 </th>
                            <th class="column-title no-link last"><span class="nobr">操作</span>
                            </th>
                          </tr>
                        </thead>
                        <tbody>
                        <tr class="even pointer" th:each="entity : ${pageList}">
							<td th:text="${entity.id}"></td>
							<td th:text="${entity.title}"></td>
							<td th:text="${entity.articleCategory?.name}"></td>
							<td th:text="${entity.source}"></td>
							<td th:text="${#dates.format(entity.createTime, 'yyyy/MM/dd HH:mm:ss')}"></td>
							<td>
							<p th:if="${entity.message}">留言<p>
							<p th:if="${entity.enroll}">报名<p>
							</td>
							<td>
							<p>点击：[[${entity.clickNumber}]] + [[${entity.dummyClickNumber}]]</p>
							<p>分享：[[${entity.shareNumber}]]</p>
							<p>报名：<p>
							</td>
							<td th:text="${entity.sort}" th:if="${param.catId}"></td>
							<td>
								<a href="javascript:;" th:if="${entity.message}" class="btn btn-primary btn-xs hide"  permission-rel="/comment/list" th:onclick="'list.comment(' + ${entity.id} + ')'"><i class="fa fa-folder"></i> 进入留言 </a><br>
								<a href="javascript:;" th:if="${entity.enroll}" class="btn btn-primary btn-xs hide"  permission-rel="/articleApply/list" th:onclick="'list.apply(' + ${entity.id} + ')'"><i class="fa fa-folder"></i> 进入报名 </a><br>
								<a href="javascript:;" th:if="${param.catId}" class="btn btn-primary btn-xs hide"  permission-rel="/article/sort" th:onclick="'list.sort(' + ${entity.id} + ')'"><i class="fa fa-folder"></i> 置顶 </a>
							</td>
							
							<td >
								<a href="javascript:;" class="btn btn-primary btn-xs hide"  permission-rel="/article/detail" th:onclick="'list.detail(' + ${entity.id} + ')'"><i class="fa fa-folder"></i> 查看 </a>
								<a href="javascript:;" class="btn btn-info btn-xs hide"  permission-rel="/article/updatePage" th:onclick="'list.update(' + ${entity.id} + ')'"><i class="fa fa-pencil"></i> 编辑 </a>
								<a href="javascript:;" class="btn btn-danger btn-xs hide"  permission-rel="/article/delete" th:onclick="'list.delete(' + ${entity.id} + ')'"><i class="fa fa-trash-o"></i> 删除 </a>
                            </td>
						</tr>
                          
                        </tbody>
                      </table>
                      
                    </div>
                  </div>
                  <div class="x_title">
                    <div class="clearfix"></div>
                  </div>
                  <div class="x_content">
                   
                  </div>
                  
                </div>
              </div>
				<div th:replace="fragments/page :: page"></div>

				
			</div>

			<!-- footer content -->
			<footer>
				<div class="pull-right">
					Powered by YouPu team<a target="_blank"
						href="http://www.youpuchina.com"></a>
				</div>
				<div class="clearfix"></div>
			</footer>
			<!-- /footer content -->
		</div>
	</div>

	<div th:replace="fragments/dependency :: list-js"></div>
	
	<script type="text/javascript">
	var list = {
		baseUrl:"article",
		area:['60%','90%'],
		init : function() {
			$('button[name=add]').bind('click',list.add);
			$('button[name=query]').bind('click',function(){
				window.location.href=list.query();
			});
		},
		apply:function(id){
			window.location.href="/articleApply/list?articleId="+id;//查看报名人数
		},
		
		comment:function(id){
			window.location.href="/comment/list?articleId="+id;//进入留言管理
		},
		sort:function(id){
			adminLayer.confirm({title:'警告',content:'确定置顶吗？',yes:function(){
				httpClientForUpAdmin.del('/'+list.baseUrl+'/sort/?id='+id,null,function(data){
					if(data.Type==200){
						adminLayer.alert({content:'置顶成功',yes:function(){
							location.reload();
						}});
					}
				});
			}});
			
		},
		detail:function(id){
			adminLayer.ifream({title:'查看',content:'/'+list.baseUrl+'/detail/?id='+id+'&readonly=y',area:list.area});
		},
		add:function(){
			adminLayer.ifream({title:'新增',content:'/'+list.baseUrl+'/addPage/',area:list.area});
		},
		update:function(id){
			adminLayer.ifream({title:'编辑',content:'/'+list.baseUrl+'/updatePage/?id='+id+'&readonly=n',area:list.area});
		},
		delete:function(id){
			adminLayer.confirm({title:'警告',content:'确定删除吗？',yes:function(){
				httpClientForUpAdmin.del('/'+list.baseUrl+'/delete/?id='+id,null,function(data){
					if(data.Type==200){
						adminLayer.alert({content:'删除成功',yes:function(){
							location.reload();
						}});
					}
				});
			}});
			
		},
		query : function() {
			pageFoot.searchUrl = '/'+list.baseUrl+'/list';
			var oneCatId = $("#oneCatId").val();
			var catId = $("#catId").val();
			var title = $("input[name=title]").val();
			var beginTime = $("input[name=beginTime]").val();
			var endTime = $("input[name=endTime]").val();
			return pageFoot.addParam("oneCatId", oneCatId).addParam("catId", catId).addParam("title", title).addParam("beginTime", beginTime).addParam("endTime", endTime).searchUrl;
		}
	}
	pageFoot.getCurrentUrl = function() {
		return list.query();
	}
	pageFoot.init();
	list.init();
</script>

<script type="text/javascript" th:inline="javascript">
		$(function() {
			var oneCatId = [[${param.oneCatId}]]
			var catId = [[${param.catId}]]
			if (oneCatId) {
				$('#oneCatId').val(oneCatId)
				parent();
			}
			
			$("#oneCatId").on("change", function() {
				parent();
			});
			function parent(){
				var parentId = $("#oneCatId").val();
				if (parentId == "") {
					$("#catId").empty();
					$("#catId").html('<option value="">请选择</option>');
				} else {
					httpClientForUpAdmin.get("/article/getCategory?parentId=" + parentId, null, function(data) {
						if(data==""){
							var parentName = $("#oneCatId").find("option:selected").text();
							$("#catId").html("<option value="+parentId+" selected>"+parentName+"</option>");
							return false;
						}
						var html='<option value="">请选择</option>';
						$.each(data,function(i,v){
							if(catId == v.id){
								html+="<option value="+v.id+" selected>"+v.name+"</value>"  
							}else{
								html+="<option value="+v.id+">"+v.name+"</value>"  
							}
                    		})  
                    		$("#catId").empty();
						$("#catId").html(html);
					});
				}
			}
		})
		
		//开始时间控件初始化
	$('#myDatepicker0').datetimepicker({
		ignoreReadonly : true,
		allowInputToggle : true,
		format : 'YYYY/MM/DD'
	});
	//结束时间控件初始化
	$('#myDatepicker1').datetimepicker({
		ignoreReadonly : true,
		allowInputToggle : true,
		format : 'YYYY/MM/DD'
	});
	</script>
</body>
</html>
